// 入口函数
$(function () {
    // 需求1: 点击a链接，显示隐藏切换;
    $("#loginBox a").on('click',function(){
        // 点击的登录框内部的a链接
        // 显示的注册区域,隐藏登录区域
        $("#regBox").show();
        $("#loginBox").hide();
    });
    $("#regBox a").on('click',function(){
        // 点击的注册框内部的a链接
        // 显示的登录区域,隐藏注册区域
        $("#loginBox").show();
        $("#regBox").hide();
    });

    // 需求2: 自定义校验规则
    // console.log(layui); //导入 layui。all。js文件
    let form = layui.form; // 把layui里面的form
    // 定义校验规则，使用的是 form。verify（），
    // 参数是对象，属性是名称，值是校验规则
    form.verify({
        // 属性是校验名称，值是校验规则，
        // 值有两种类型：函数和数组！
        username:[
            /^[a-zA-Z0-9]{1,10}$/,
            '用户名必须1到10位数字和字母'
        ],
        pwd:[
            /^[a-zA-Z0-9]{6,12}$/,
            '密码必须6到12位数字和字母'
        ],
        // 确认密码规则
        rePwd: function(value){
            // value就是你给那个标签加这个校验规则，
            // 这个标签的值就赋值给value
            // console.log(value);
            // console.log($("#reBox input[name=password]").val());
            // console.log($("#reBox input[name=repassword]").val());
            let pwd = $("#regBox input[name=password]").val();
            // 如果原密码的值和确认密码的值不相等，就报错
            if (pwd !== value ){
                return '两次密码输入不一致'
            }
        }
    });

    // 需求3:注册功能;
    let layer = layui.layer;
    $("#formReg").on('submit',function (e) {
        // 阻止表单默认提交
        e.preventDefault();
        // 发送 axios
        axios({
            method:'POST',
            url:'/api/reguser',
            // 不要传递对象类型，因为对象类型头信息设置的是application/json
            // content-type:application/json,目前借口文档不支持；
            data:$(this).serialize() //a=1&b=2&c=3
        }).then(res=>{
            // console.log(res.data);
            // 判断返回数据是否正确
            if(res.data.status !== 0){
                // return aleat(res.data.message);
                return layer.msg(res.data.message);
            }
            // 成功后，提示;
            // alert("恭喜你，注册用户成功！")
            layer.msg("恭喜你，注册用户成功!");
            // 切换到登录模块
            $("#regBox a").click();
            // 清空表单 - DOM元素中，有一个 reset() 可以重置表单;
            $("#formReg")[0].reset();
        });
    });

    // 需求4: 登录功能
    $("#formLogin").on('submit',function (e) {
        // 阻止表单默认提交
        e.preventDefault();
        // 发送ajax
        axios({
            method:'POST',
            url:'/api/login',
            data:$(this).serialize()
        }).then(res=>{
            // console.log(res.data);
            // 判断
            if(res.data.status !== 0){
                return layer.msg(res.data.message);
            }
            // 成功：提示，存储token
            layer.msg('恭喜你，登陆成功！');
            localStorage.setItem('token',res.data.token);
            // 页面跳转到 index.html
            location.href = '/index.html';
        });
    });

});